function showTab(tabName) {
    const contents = document.querySelectorAll('.tab-content');
    contents.forEach(content => {
        content.classList.remove('active');
    });

    document.getElementById(tabName).classList.add('active');
}

function addBlock() {
    const inputBlocks = document.getElementById('input-blocks');
    const newBlock = document.createElement('table');
    newBlock.className = 'iksweb';
    newBlock.innerHTML = `
        <tbody>
            <tr>
                <td rowspan="4"></td>
                <td rowspan="4"></td>
                <td rowspan="2">левый</td>
                <td>KL</td>
                <td><input type="text" name="op1"></td>
                <td><input type="text" name="op2"></td>
                <td><input type="text" name="op3"></td>
                <td><input type="text" name="op4"></td>
                <td><input type="text" name="op5"></td>
                <td><input type="text" name="op6"></td>
                <td><input type="text" name="op7"></td>
                <td><input type="text" name="op8"></td>
                <td><input type="text" name="op9"></td>
            </tr>
            <tr>
                <td>KR</td>
                <td><input type="text" name="op10"></td>
                <td><input type="text" name="op11"></td>
                <td><input type="text" name="op12"></td>
                <td><input type="text" name="op13"></td>
                <td><input type="text" name="op14"></td>
                <td><input type="text" name="op15"></td>
                <td><input type="text" name="op16"></td>
                <td><input type="text" name="op17"></td>
                <td><input type="text" name="op18"></td>
            </tr>
            <tr>
                <td rowspan="2">правый</td>
                <td>KL</td>
                <td><input type="text" name="op19"></td>
                <td><input type="text" name="op20"></td>
                <td><input type="text" name="op21"></td>
                <td><input type="text" name="op22"></td>
                <td><input type="text" name="op23"></td>
                <td><input type="text" name="op24"></td>
                <td><input type="text" name="op25"></td>
                <td><input type="text" name="op26"></td>
                <td><input type="text" name="op27"></td>
            </tr>
            <tr>
                <td>KR</td>
                <td><input type="text" name="op28"></td>
                <td><input type="text" name="op29"></td>
                <td><input type="text" name="op30"></td>
                <td><input type="text" name="op31"></td>
                <td><input type="text" name="op32"></td>
                <td><input type="text" name="op33"></td>
                <td><input type="text" name="op34"></td>
                <td><input type="text" name="op35"></td>
                <td><input type="text" name="op36"></td>
            </tr>
        </tbody>
    `;
    inputBlocks.appendChild(newBlock);
}

async function saveMeasurement() {
    const inputBlocks = document.querySelectorAll('.iksweb');
    const measurements = Array.from(inputBlocks).map(block => {
        const inputs = block.querySelectorAll('input');
        return {
            op1: inputs[0].value,
            op2: inputs[1].value,
            op3: inputs[2].value,
            op4: inputs[3].value,
            op5: inputs[4].value,
            op6: inputs[5].value,
            op7: inputs[6].value,
            op8: inputs[7].value,
            op9: inputs[8].value,
            op10: inputs[9].value,
            op11: inputs[10].value,
            op12: inputs[11].value
        };
    });

    for (let measurement of measurements) {
        const response = await fetch('/api/measurements', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(measurement)
        });
        if (response.ok) {
            alert('Измерение сохранено');
        } else {
            alert('Ошибка сохранения измерения');
        }
    }
}

async function calculate() {
    const measurementId = document.getElementById('measurementId').value;
    const isClockwise = document.getElementById('isClockwise').checked;
    const response = await fetch(`/api/measurements/calculate?measurementId=${measurementId}&isClockwise=${isClockwise}`, {
        method: 'POST'
    });
    if (response.ok) {
        const result = await response.json();
        document.getElementById('calculationResult').innerText = `Результат: ${result.join(', ')}`;
    } else {
        alert('Ошибка расчета');
    }
}

document.addEventListener('DOMContentLoaded', () => {
    showTab('data');
});